// 业务分析
<template>
  <div class="big_box" :style="{ minHeight: transferHeight + 'px' }" id="userBigZH">
    <el-tabs class="scorllFixed" v-model="activeName" @tab-click="handleClick">
      <el-tab-pane :label="item.name" :name="item.path" v-for="item in jurisdiction" :key="item.name">
        <router-view v-if="activeName === item.path"></router-view>
      </el-tab-pane>
      <!-- <el-tab-pane label="资产概况" name="bayonetList">
        <router-view v-if="activeName === 'bayonetList'"></router-view>
      </el-tab-pane>
      <el-tab-pane label="业务概览" name="electronicPolice">
        <router-view v-if="activeName === 'electronicPolice'"></router-view>
      </el-tab-pane>
      <el-tab-pane label="分布概览" name="electronicDictionary">
        <router-view v-if="activeName === 'electronicDictionary'"></router-view>
      </el-tab-pane>-->
    </el-tabs>
  </div>
</template>
<script>
import { setUrl } from '@/utils/getUrl.js'
import { getAuthority } from '@/assets/js/getAuthority.js'
export default {
  data() {
    return {
      activeName: 'overviewPage',
      jurisdiction: [],
    }
  },
  computed: {
    transferHeight() {
      // 计算屏幕滚动高度 - nav - 导航栏
      return window.innerHeight - 70
    },
  },
  watch: {
    jurisdiction: {
      deep: true,
      handler(newVal, oldVal) {
        // console.log(newVal, oldVal)
        this.jurisdiction = newVal // 保存列表
        this.activeName = this.$route.name
        this.$router.push(this.$route.path)
      },
    },
    // 监听url中的hash值的变化
    $route(to, from) {
      const hashUrl = window.location.hash.substr(2)
      if (hashUrl.startsWith('overviewPage')) {
        this.activeName = 'overviewPage'
      } else if (hashUrl.startsWith('dynamicEnvironment')) {
        // 业务概览
        this.activeName = 'dynamicEnvironment'
      } else if (hashUrl.startsWith('distributionPreview')) {
        // 分布概览
        this.activeName = 'distributionPreview'
      } else if (hashUrl.startsWith('userTrack')) {
        // 用户轨迹
        this.activeName = 'userTrack'
      }
    },
  },
  created() {
    getAuthority(this, 'survey') // 获取权限
    // const menus = JSON.parse(getUrl('jurisdiction'))
    // // console.log('----0', menus)
    // if (menus.length === 0) {
    //   return this.$router.push('/excel')
    // }
    // this.activeName = menus[0].qxfwlj
    // let obj = {}
    // menus.forEach((item) => {
    //   obj = {
    //     name: item.qxmc,
    //     path: item.qxfwlj,
    //   }
    //   this.jurisdiction.push(obj)
    // })
    // console.log(this.jurisdiction)
    // 判断本地存储中是否有地址
    // const url = getUrl('survey')
    // if (!url) return (this.activeName = this.jurisdiction[0].path)
    // this.activeName = url
  },
  mounted() {
    // startLoading(document.getElementById('userBigZH'))
  },
  updated() {},
  destroyed() {
    // 默认
    setUrl('survey', '')
  },
  methods: {
    // 刷新右侧需要调用的函数
    getChildRefresh() {
      getAuthority(this, 'survey') // 获取权限
    },
    handleClick(tab, event) {
      // 防止一直加载动画
      // if (window.location.hash.substr(2) !== tab.name) {
      //   startLoading(document.getElementById('userBigZH'))
      // }
      setUrl('survey', tab.name)
      if (tab.name === 'overviewPage') {
        this.$router.push('/overviewPage')
      } else if (tab.name === 'dynamicEnvironment') {
        // 业务概览
        this.$router.push('/dynamicEnvironment')
      } else if (tab.name === 'distributionPreview') {
        // 分布概览
        this.$router.push('/distributionPreview')
      } else if (tab.name === 'userTrack') {
        // 用户轨迹
        this.$router.push('/userTrack')
      }
    },
  },
}
</script>

<style lang="scss" scoped>
.big_box {
  background-color: #f2f2f2;
  // width: 101.5%;
  width: 100%;
  // position: relative;
  // left: -12px;
  // padding: 0 15px;
}
</style>
